<!--

  Vant的Switch开关组件

  // 带*号表示必填属性
  props:
    v-model:(Boolean)                  开关选中状态
    loading:(Boolean)                  是否为加载状态
    disabled:(Boolean)                 是否为禁用状态
    size:(String || Number)            开关尺寸，默认单位为px
    active-color:(String)              打开时的背景色
    inactive-color:(String)            关闭时的背景色
    active-value:(any)                 打开时对应的值
    inactive-value:(any)               关闭时对应的值

  slot:

  events:
    change	                           开关状态切换时触发     value: any
    click	                             点击时触发	           event: Event

  demo:
    <qm-switch
      v-model="..."
      active-color="#3385FF"
      inactive-color="#c3cbd6"
    ></qm-switch>

  更多帮助请查看Vant官网： https://vant-contrib.gitee.io/vant/v2/#/zh-CN/switch

-->



<template>
    <van-switch
    class="qm-switch"
      v-bind="$attrs"
      v-on="$listeners"
      :size="size"
    ></van-switch>
</template>

<script>
import {Switch} from "vant";
export default {
  inheritAttrs: true,
  components: {
    [Switch.name]: Switch
  },
  data(){
    return{

    }
  },
  props: {
      size: {
          type: String,
          default: "calc(48px * var(--ratio))"
      }
  }
};
</script>

<style lang="less" scoped>

.qm-switch {
  border: none;
}
/deep/ .van-switch__node {
  width: 0.8em;
  height: 0.8em;
  top: 0.1em;
  left: 0.1em;
  box-shadow: none;
}
</style>
